
class Main extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [],
            name: '',
            id: 0,
            state: "ALL",
            start: 1,
            pagesize: 15,
            counts: [],
            keyword: '',
            tradenum: '',
            name: '',
            holdingdays: '',
        };
    }

    formatlist(list) {
        var listitem = [], wulist = [], addressarr = [], goodsinfoarr = [], { ishour } = this.state;
        if (list.length > 0) {
            list.forEach((x, i) => {
                let profit=0,redemptionprice=0,bonusprice=0,rewardprice=0,price=0
                let difference=x.newnetworth-x.networth<0?'xy':'dy'
                profit=(((x.newnetworth - x.networth) * x.share)  / 10000).toFixed(2)
                if(x.newnetworth - x.networth>0){
                    // bonusprice==((parseInt((((x.newnetworth - x.networth) * x.share)*((10000 - x.remuneration) / 10000.00)  / 100)))/100).toFixed(2)
                    // bonusprice==(((parseInt(((x.newnetworth - x.networth) * x.share)*(1-(x.remuneration/10000.00))  / 100.00)))/100).toFixed(2)
                    rewardprice=((parseInt((((x.newnetworth - x.networth) * x.share)*(x.remuneration/10000.00)  / 100)))/100).toFixed(2)
                    price=(((x.newnetworth - x.networth) * x.share)*(1-(x.remuneration/10000.00))  / 100.00)
                    bonusprice=((parseInt(price))/100).toFixed(2)
                }else if(x.newnetworth - x.networth==0){
                    price=0
                }else{
                    price=(((x.newnetworth - x.networth) * x.share) / 100.00)
                }
                console.log(price,'priceprice');
                redemptionprice=(((x.total+price)*(x.redemptionrate/10000.00))/100).toFixed(2)

                listitem.push(
                    <div className="orderitem">
                        <div className="orderheader">
                            <div>
                                <p>{getstatecontent(x.state)}</p>
                                <p>订单号：{x.ordernum}</p>
                                <p style={{ display: x.confirmDate == 0 ? "none" : "" }}>份额确定时间：{getLocalTime(new Date(x.confirmDate * 1000))}</p>
                                <p style={{ display: x.redeemDate == 0 ? "none" : "" }}>赎回申请时间：{getLocalTime(new Date(x.redeemDate * 1000))}</p>
                                <p style={{ display: x.confirmredeemDate == 0 ? "none" : "" }}>确认赎回时间：{getLocalTime(new Date(x.confirmredeemDate * 1000))}</p>
                                <p style={{ display: x.state != "PAY_SUCCESS" ? "" : "none" }} >确认时净值：{(x.networth/10000).toFixed(4)}</p>
                                <p style={{ display: x.state != "REDEEMED" && x.state != "SOLVED" ? "" : "none" }} className={difference}>最新净值：{(x.newnetworth/10000).toFixed(4)}</p>
                                <p style={{ display: x.state == "REDEEMED" || x.state == "SOLVED" ? "" : "none" }}>结算时净值：{(x.redemptionnetworth/10000).toFixed(4)}</p>
                                {/* <p>付款人：{x.nickname}</p> */}
                            </div>
                            {/* <p className="todetails" onClick={this.todetails.bind(this,x.item.ordernum)}>订单详情</p> */}
                        </div>
                        <div className="ordercontent">
                            <div>
                                <p className="name">昵称：{x.nickname}</p>
                                <p>电话：{x.phone}</p>
                                <p>份额：{x.share}份</p>
                                <p style={{ display: x.state != "PAY_SUCCESS"? "" : "none" }}>持有天数：{x.holdingdays}天</p>
                                {/* <p>地址：{x.item.address}</p>
                            <p className="red" style={{ display: x.item.message? "" : "none" }}>留言：{x.item.message}</p> */}
                            </div>
                            <div>
                                {/* {goodshtml} */}
                                <div>
                                    <p>基金名称：{x.name}</p>
                                    {/* <p>
                                    <img src={`${API_HEAD}imgs/${goodsinfoarr.data[0].topimg}`}/>
                                    <span>{x.name}</span>
                                </p> */}
                                    {/* <p>x<span>{goodsinfoarr.data[0].goodscount}</span></p> */}
                                </div>
                                {/* <div>
                                <p>份额：{x.share}</p>
                            </div> */}
                                <div>
                                    <p>报酬比例：{(x.remuneration / 100).toFixed(2)}%</p>
                                </div>
                                <div>
                                    <p>购买费率：{(x.purchaserate / 100).toFixed(2)}%</p>
                                </div>
                                <div>
                                    <p>赎回费率：{(x.redemptionrate / 100).toFixed(2)}%</p>
                                </div>
                            </div>
                            <div className={ x.state != "PAY_SUCCESS"? "between" : "" }>
                                <div>
                                <p>购买额度：<span>{(x.total / 100).toFixed(2)}</span></p>
                                <p>购买费用：<span>{((x.price-x.total) / 100).toFixed(2)}</span></p>
                                <p>合计实付：<span>{(x.price / 100).toFixed(2)}</span></p>
                                </div>
                                <div style={{ display: x.state != "PAY_SUCCESS" ? "" : "none" }}>
                                <p  style={{ display: x.state != "REDEEMED" && x.state != "SOLVED" ? "" : "none"}}>收益：<span>{profit}</span></p>
                                <p  style={{ display: x.state == "REDEEMED" || x.state == "SOLVED" ? "" : "none"}}>收益：<span>{(x.profit / 100).toFixed(2)}</span></p>
                                <p  style={{ display: x.state != "REDEEMED" && x.state != "SOLVED" ? "" : "none"}}>赎回费用：<span>{redemptionprice}</span></p>
                                <p style={{ display: x.state == "REDEEMED" || x.state == "SOLVED" ? "" : "none"}}>赎回费用：<span>{(x.redemptionprice / 100).toFixed(2)}</span></p>
                                <p style={{ display: x.state != "REDEEMED" && x.state != "SOLVED" ? "" : "none"}}>业绩分红：<span>{bonusprice }</span></p>
                                <p style={{ display: x.state == "REDEEMED" || x.state == "SOLVED" ? "" : "none"}}>业绩分红：<span>{(x.bonusprice / 100).toFixed(2)}</span></p>
                                <p style={{ display: x.state != "REDEEMED" && x.state != "SOLVED" ? "" : "none"}}>业绩报酬：<span>{rewardprice}</span></p>
                                <p style={{ display: x.state == "REDEEMED" || x.state == "SOLVED" ? "" : "none"}}>业绩报酬：<span>{(x.rewardprice / 100).toFixed(2)}</span></p>
                                <p  style={{ display: x.state == "REDEEMED" || x.state == "SOLVED" ? "" : "none" }}>结算额度：<span>{(x.settlementlimit / 100).toFixed(2)}</span></p>
                                </div>
                                {/* <p>商品总额：￥ <span>{(totalprice/100).toFixed(2)}</span><span style={{display:x.item.isretail=="F"&&totalscore>0?"":"none"}}> + {totalscore}积分</span></p>
                            <p style={{display:x.item.isretail=="F"&&x.item.score>0?"":"none"}}>积分： - <span>{x.item.score}</span></p>
                            <p>总计：￥ <span>{(x.item.price/100).toFixed(2)}</span></p> */}
                            </div>
                        </div>
                        <div className="orderfooter">
                            <p style={{ display: x.state == "PAY_SUCCESS"&&x.istime == 1 ? "" : "none" }}  onClick={this.confirmedshareing.bind(this)}>份额待确认</p>
                            <p style={{ display: x.state == "PAY_SUCCESS"&&x.istime != 1 ? "" : "none" }} className="fahuo" data-toggle="modal" data-target="#modalOne"  onClick={this.confirmedshare.bind(this, x.ordernum)}>确定份额</p>
                            <p style={{ display: x.state == "REDEEM" && ((ishour && x.isday == 0) || x.istwoday == 0)? "" : "none" }} className='fahuo' onClick={this.confirmedredeem.bind(this, x.ordernum)}>确定赎回</p>
                            {/* && ((ishour && x.isday == 0) || x.istwoday == 0)  */}
                            <p style={{ display: x.state == "REDEEMED" ? "" : "none" }} className='fahuo' onClick={this.confirmsettlement.bind(this, x.ordernum)}>确定结算</p>
                            {/* <p style={{ display:x.item.state=="PAYSUCCESS"? "" : "none" }} onClick={this.sendgoods.bind(this,x.item.ordernum)}  data-toggle="modal" data-target="#modalOne" className="fahuo">自送发货</p> */}
                            {/* <p style={{ display:x.item.state=="SOLVING"? "" : "none" }}  onClick={this.refund.bind(this,x.item.ordernum)}>退款</p> */}
                        </div>
                    </div>
                )
            });
        }
        else {
            wulist.push(
                <p className="wulist">暂无数据</p>
            )
        }
        this.setState({ listitem, list, originallist: list, wulist })
        // this.setState({listitem})
    }
    confirmedshareing(){
        alert("订单未满7天，无法确认份额")
    }
    //确认份额
    confirmedshare(e) {
        let { list,isholiday } = this.state
        if(isholiday){
            alert('今天是节假日，不能确认份额')
        }else{
            list.forEach(x => {
                if (x.ordernum == e) {
                    let share=parseInt(x.total/(x.newnetworth/100.00))
                    this.setState({ share,confirmedshareordernum:e })
                }
            })
        }
            
            // let { start } = this.state
            // confirmedshare(e, res => {
            //     if (res.issuccess == 1) {
            //         alert('成功确认份额')
            //         this.freshlist(start)
            //     } else {
            //         alert(res.msg)
            //     }
            // })
        

    }
    //确认赎回
    confirmedredeem(e) {
        let { list,isholiday } = this.state
        if(isholiday){
            alert('今天是节假日，不能确认份额')
        }else{
            list.forEach(x => {
                if (x.ordernum == e) {
    
                    let fundincome =0, purchase = 0, newfundincome = 0,newpurchase=0,price=0,profit=0
                    // if (fundincome > 0) {
                    // } else {
                    //     purchase = 0
                    // }
                    // profit=(((x.newnetworth - x.networth) * x.share)  / 10000).toFixed(2)
                    fundincome= ((((x.newnetworth - x.networth) * x.share) * (1 - (x.remuneration / 10000.00))) / 10000.00)
                    if (x.newnetworth - x.networth > 0) {
                        // purchase = ((((x.newnetworth - x.networth) * x.share) * (x.remuneration / 10000.00)) / 10000.00)
                        // newfundincome = ((Math.floor(fundincome*100))/100).toFixed(2)
                        // newpurchase = ((Math.floor(purchase*100))/100).toFixed(2)
                        // newpurchase=(purchase).toFixed(2)
                        price=parseInt(fundincome*100)
                    } else if(x.newnetworth - x.networth == 0){
                        // newfundincome = 0
                        // newpurchase = 0
                        price=0
                    }else{
                        // newfundincome = 0
                        // newpurchase = 0
                        price=parseInt(((x.newnetworth - x.networth) * x.share)  / 100)
                    }
                    // price=parseInt((fundincome-purchase)*100)
                    // this.setState({ name: x.name, holdingdays: x.holdingdays, newfundincome, newpurchase,price,ordernum:x.ordernum,profit,redemptionrate:x.redemptionrate })
                    this.setState({ price,ordernum:x.ordernum,redemptionrate:x.redemptionrate,content:'赎回' },()=>{
                        $('#myModal').modal('toggle');
                    })
                }
            })
        }
    }
    //确认结算
    confirmsettlement(e) {
        let { isholiday } = this.state

        if(isholiday){
            alert('今天是节假日，不能确认份额')
        }else{
            this.setState({settlementordernum:e,content:'结算'},()=>{
                $('#myModal').modal('toggle');
            })
        }
            // let { start } = this.state
            // confirmedshare(e, res => {
            //     if (res.issuccess == 1) {
            //         alert('成功确认份额')
            //         that.freshlist(start)
            //     } else {
            //         alert(res.msg)
            //     }
            // })

    }
    //  // 删除
    //  del(e){    
    //     this.setState({delid:e},()=>{
    //         $('#myModal').modal('toggle');
    //     })
    // }
    confirmdel(){
        let {content}=this.state,that=this
        if(content=="赎回"){
            let {price,ordernum,redemptionrate,state}=that.state
            that.setState({showloading:'ON'})
            confirmredeem({total:price,number:ordernum,redemptionrate},res=>{
                that.setState({showloading:''})
                if(res.issuccess==1){
                    alert('确认赎回')
                    $('#myModal').modal('toggle');
                    that.freshlist(state);
                }else{
                    alert('赎回失败')
                    $('#myModal').modal('toggle');
                }
            })
        }else{
            let {settlementordernum,start}=this.state
           confirmsettlement(settlementordernum, res => {
               if (res.issuccess == 1) {
                   alert('结算成功')
                   $('#myModal').modal('toggle');
                   this.freshlist(start)
               } else {
                   alert(res.msg)
                   $('#myModal').modal('toggle');
               }
           })
        }






        
    }
    // // 编辑
    // todetail(e){
    //     var {list,name} = this.state;
    //         list.forEach(x=>{
    //             if(x.id == e) {
    //                 name=x.name
    //             }
    //         });
    //         this.setState({
    //             id:e,
    //             name
    //         })
    // }
    // 详情
    todetails(e) {
        window.location.href = "./orderdetail.html?ordernum=" + e;
    }
    //    查询
    searchinput(e) {
        this.setState({ keyword: e.target.value })
    }
    search() {
        if (this.state.keyword.length == 0) return;
        this.setState({ showloading: 'ON' })
        let { keyword, start, pagesize } = this.state, that = this;
        //     Ordersgetlistbystate({start,pagesize,state,keyword}, res => {
        //         if (res.issuccess == 1) {
        that.freshlist(start)
        //     }
        // })
    }
    reset() {
        let { state } = this.state
        this.setState({ keyword: '', showloading: 'ON' }, () => {
            this.freshlist(1);
        });

    }
   

    submit() {

            let { start,confirmedshareordernum } = this.state
            confirmedshare(confirmedshareordernum, res => {
                if (res.issuccess == 1) {
                    alert('成功确认份额')
                    this.freshlist(start)
                } else {
                    alert(res.msg)
                }
            })


        // let {price,ordernum,redemptionrate,state}=this.state
        // this.setState({showloading:'ON'})
        // confirmredeem({total:price,number:ordernum,redemptionrate},res=>{
        //     this.setState({showloading:''})
        //     if(res.issuccess==1){
        //         alert('确认赎回')
        //         this.freshlist(state);
        //     }else{
        //         alert('赎回失败')
        //     }
        // })


    }

    componentDidMount() {
        this.setState({ showloading: 'ON' })
        let that = this;
        let today=new Date()
        let hour = new Date().getHours()
        if (hour >= 15) {
            this.setState({ ishour: !0 })
        } else {
            this.setState({ ishour: !1 })
        }
        if(today.getDay() == '6'||today.getDay() == '0'){
            that.setState({isholiday:!0})
        }else{
            that.setState({isholiday:!1})
        }
        this.freshlist(1)
        // this.formatlist()   

    }
    freshlist(start) {
        let { pagesize, keyword, state } = this.state;
        Ordersgetlistbystate({ start, pagesize, state, keyword }, res => {
            this.setState({ showloading: '' })
            if (res.issuccess == 1) {
                if (start == 1) {
                    let pagecount = Math.ceil(res.total / pagesize);
                    this.setpager(pagecount, start);
                    this.setState({ start, total: res.total })
                }
                this.formatlist(res.list);
            }
        })
    }
    // 退押金
    // refund(e) {
    //     this.setState({ delid: e }, () => {
    //         $('#myModal').modal('toggle');
    //     })
    // }
    // confirmdel() {
    //     this.setState({ showloading: 'ON' })
    //     let { delid } = this.state, that = this
    //     setrefund(delid, res => {
    //         this.setState({ showloading: '' })
    //         if (res.issuccess == 1) {
    //             alert(res.data)
    //             $('#myModal').modal('toggle');
    //             that.freshlist(0)
    //         } else {
    //             $('#myModal').modal('toggle');
    //         }
    //     })
    // }
    // 发货
    sendgoods(e) {
        this.setState({ ordernumitem: e })
        // sendgoods(e,res=>{
        //     if(res.issuccess==1){
        //         alert('发货成功！')
        //         that.freshlist(0,that.state.state)
        //     }
        // })
    }
    setpager(pagecount, start) {
        let counts = [];
        for (let i = 0; i < pagecount; i++) {
            counts.push(start + i)
        }
        this.setState({ counts, pagestart: 0 })
    }
    clickpage(e) {
        this.setState({ showloading: 'ON' })
        let { start, pagesize } = this.state
        start = e * pagesize
        this.setState({ pagestart: e, start }, () => {
            this.freshlist(start)
        })
    }
    setpage(e) {
        this.setState({ showloading: 'ON' })
        let { pagesize, start } = this.state
        pagesize = parseInt(e)
        // console.log(pagesize,'pagesizepagesizepagesize');
        this.setState({ pagesize }, () => {
            this.freshlist(start)
        })
    }
    tabstate(e) {
        let that = this, { start, state } = that.state
        state = e
        start = 1
        console.log(e, 'e.target.value')
        // let { target } = this.state;
        // target[prop] = e.target.value
        // this.setState({ target })
        this.setState({ state, start, showloading: 'ON' }, () => {
            that.freshlist(start)
        })
    }
    inputchange(prop, e) {
        // let { target } = this.state;
        // target[prop] = e.target.value
        // this.setState({ target })
        this.setState({ [prop]: e.target.value })
    }
    //更新订单
    updateorders() {
        this.setState({ showloading: 'ON' })
        let { start } = this.state
        updateorders(res => {
            this.setState({ showloading: '' })
            if (res.issuccess == 1) {
                alert('更新成功')
                this.freshlist(start)
            } else {
                alert('更新失败')
            }
        })
    }
    render() {
        let { listitem, wulist, counts, pagestart, keyword, name, holdingdays, newfundincome, newpurchase,profit,content,share } = this.state;

        return (
            <div className="breadLinebox">
                <Modal content={"确定要"+content+"吗？"} click={this.confirmdel.bind(this)} />
                <Loading hidden={this.state.showloading != 'ON'} />
                <div className="modal fade" id="modalOne" >
                    <div className="modal-dialog">
                        <div className="modal-content">

                            <div className="modal-header border">
                                <img data-dismiss="modal" src="./src/close.png" />
                            </div>
                            <div className="modal-body">
                                <div className="input-group">
                                    <span className="input-group-addon">份额：</span>
                                    <p>{share}</p>
                                </div>
                            </div>
                            <div className="modal-footer border">
                                <button type="button" className="closemod" data-dismiss="modal">关闭</button>
                                <button type="button" onClick={this.submit.bind(this)} data-dismiss="modal" className="submitmod">提交</button>
                            </div>

                        </div>
                    </div>
                </div>
                
                {/* <div className="modal fade" id="modalOne" >
                    <div className="modal-dialog">
                        <div className="modal-content">

                            <div className="modal-header border">
                                <img data-dismiss="modal" src="./src/close.png" />
                            </div>
                            <div className="modal-body">
                                <div className="input-group">
                                    <span className="input-group-addon">产品名称：</span>
                                    <p>{name}</p>
                                </div>
                                <div className="input-group">
                                    <span className="input-group-addon">持有天数：</span>
                                    <p>{holdingdays}</p>
                                </div>
                                <div className="input-group">
                                    <span className="input-group-addon">收益：</span>
                                    <p>{profit}</p>
                                </div>
                                <div className="input-group">
                                    <span className="input-group-addon">分红：</span>
                                    <p>{newfundincome}</p>
                                </div>
                                <div className="input-group">
                                    <span className="input-group-addon">业绩：</span>
                                    <p>{newpurchase}</p>
                                </div>
                            </div>
                            <div className="modal-footer border">
                                <button type="button" className="closemod" data-dismiss="modal">关闭</button>
                                <button type="button" onClick={this.submit.bind(this)} data-dismiss="modal" className="submitmod">提交</button>
                            </div>

                        </div>
                    </div>
                </div>
                */}
                <div className='content_wrap panel-default content_wrap'>
                    <div className="breadLine">
                        <div className="img">
                            <img src='./src/lm_order1.png' />
                            订单管理
                        </div>
                    </div>
                    <div className="content">
                        <div className="tabletit">
                            <div className="search">
                                <input onChange={this.searchinput.bind(this)} value={keyword} type="text" placeholder='请输入订单号' className />
                                <p onClick={this.search.bind(this)}>查询</p>
                                <p onClick={this.reset.bind(this)}>返回</p>
                            </div>
                            {/* <p className="add" onClick={this.updateorders.bind(this)}>更新订单</p> */}
                        </div>
                        <div className="tabbox">
                            <p className={this.state.state == "ALL" ? "click" : ''} onClick={this.tabstate.bind(this, "ALL")}>全部</p>
                            <p className={this.state.state == "PAY_SUCCESS" ? "click" : ''} onClick={this.tabstate.bind(this, "PAY_SUCCESS")}>份额待确认</p>
                            <p className={this.state.state == "SHARE_SUCCESS" ? "click" : ''} onClick={this.tabstate.bind(this, "SHARE_SUCCESS")}>待赎回</p>
                            <p className={this.state.state == "REDEEM" ? "click" : ''} onClick={this.tabstate.bind(this, "REDEEM")}>赎回待确认</p>
                            <p className={this.state.state == "REDEEMED" ? "click" : ''} onClick={this.tabstate.bind(this, "REDEEMED")}>结算</p>
                            <p className={this.state.state == "SOLVED" ? "click" : ''} onClick={this.tabstate.bind(this, "SOLVED")}>已完成</p>
                        </div>
                        {listitem}
                        {/* <table className="tab">
                            <thead>
                            <tr>
                            <th>订单编号</th>
                            <th>订单创建时间</th>
                            <th>支付金额</th>
                            <th className="tconter">订单状态</th>
                            <th className="cz tconter">操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            {listitem}
                            </tbody>
                        </table> */}
                        {wulist}
                        <div className="pagerbox">
                            <p>共{this.state.total}条</p>
                            <Pager counts={counts} click={this.clickpage.bind(this)} change={this.setpage.bind(this)} index={pagestart} />
                        </div>
                    </div>
                </div>
            </div>


        )


    }
}





ReactDOM.render(
    <div>
        <TopLine />
        <div id='body'>
            <LeftMenu code='order' />
            <Main />
        </div>
    </div>
    // <Barrage/>
    , $('.container')[0]
)